<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var xmlhttp; //AJAX对象
        try {
            xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e){
            try {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }catch (e){
                try {
                    xmlhttp = new XMLHttpRequest();
                }catch (e){
                    alert("您的服务器不支持AJAX!");
                }
            }

            function hello() {
                var url = "../demo?name=" + nm.value;
                //回调函数
                xmlhttp.onreadystatechange = function (){
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200){
                        res.innerText = xmlhttp.responseText;
                    }
                }
                //打开链接
                xmlhttp.open("get", url); //true 默认为异步
                //发送请求
                xmlhttp.send(null);
            }
        }
    </script>
</head>
<body>
<!-- http://127.0.0.1/工程名/AJAX/demo.html-->

<!-- http://127.0.0.1/工程名/demo-->


<h1>表单提交</h1>
<form action="../demo">
    名字:<input type="text">
    <button>Hello</button>
</form>

<h1>AJAX提交</h1>
<form>
    名字:<input type="text" name="name" id="nm" value="">
    <button type="button" onclick="hello()">Hello</button>
</form>

<span id="res"></span>
</body>
</html>